
import { checkType, randomNum } from '../shared/utils';

// 匹配onClick里面的内容
const reg_onClick = /onClick\=\"(.*?)\"/g,
      reg_fnNmae = /^(.*?)\(/,
      reg_fnArgs = /\((.*?)\)/;

/**
 * 保存绑定的事件处理函数
 * 
 * eventPool = [];
 * {
 *  flag: 随机数
 *  handler: 事件处理函数的字符串
 *  type: click
 * }
 * 
 */

const eventPool = [];

// 专门处理template上的事件函数
export function eventFormat(template) {
  // console.log(template);
  return template.replace(reg_onClick, function(node, key) {
    // console.log(node, key);
    // 添加标识，之后标识对应相应的事件处理函数
    const _flag = randomNum();

    eventPool.push({
      flag: _flag,
      handler: key.trim(),
      type: 'click'
    })

    return `data-dom="${_flag}"`; // 把之前的属性给替换掉
  })
}

// 处理给节点绑定对应的事件
export function bindEvent(methods) {
  // console.log(methods, eventPool);
  // 找到所有节点
  const allElements = document.getElementsByTagName('*');
  let oItem = null,
      _flag = 0;

  // 找到对应的节点绑定对应的事件函数
  eventPool.forEach(event => {
    // console.log(event);
    for (let i = 0; i < allElements.length; i ++) {
      oItem = allElements[i];
      _flag = parseInt(oItem.dataset.dom); // 找到标识

      if (event.flag === _flag) { // 相同就绑定事件处理函数
        oItem.addEventListener(event.type, function () {
          // 要把event.handler: 'add(2)' 字符串分离
          const fnName = event.handler.match(reg_fnNmae)[1]
          // console.log(fnName);
          // 参数可能是字符串、布尔、数字类型需要转换
          const fnArgs = checkType(event.handler.match(reg_fnArgs)[1]);
          // console.log(typeof fnArgs);
          // 执行
          methods[fnName](fnArgs);
        }, false);
      }
    }
  })
}